<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>猫狗</title>
  <link rel="stylesheet" type="text/css" href="static/css/bootstrap.min.css"/>
  <link rel="stylesheet" type="text/css" href="static/css/bootstrap-icons.css"/>
  <link rel="stylesheet" href="css/homework.css">
  <link rel="stylesheet" type="text/css" href="static/css/flaticon.css"/>
</head>
<body>
  <div class="header row">
	  <div class="col clearfix">
		 <!-- <i class="m_icon bi-geo-alt"></i> -->
		 <div class="text-box">
			  <h3>OUR OFFICE</h3>
			  <p>123, stroom, New York, USA</p>
		  </div>
	  </div>
	  <div class="col">
		  <i class="m_icon bi-envelope-open"></i>
		  <div class="text-box">
		  			  <h3>OUR OFFICE</h3>
		  			  <p>123, stroom, New York, USA</p>
		  </div>
	  </div>
	  <div class="col">
		 <i class="m_icon bi-phone-vibrate"></i>
		  <div class="text-box">
			  <h3>OUR OFFICE</h3>
			  <p>123, stroom, New York, USA</p>
		  </div>
	  </div>
  </div>
 <div class="main-container">
	  <div class="header-box clearfix">
		  <div class="logo-box">
			  <i class="m_icon bi bi-shop" style="font-size: 30px;"></i>
			  <h1>PET SHOP</h1>
		  </div>
		 <div class="right-nav-box clearfix">
			  <ul class="clearfix">
				  <li>Home</li>
				  <li>About</li>
				  <li>Service</li>
				  <li>Product</li>
				  <li>Pages<i class="bi bi-caret-down-fill"></i></li>
			  </ul>
			  <div class="contact-box">
				  <h3>Concact<i class="bi bi-arrow-right-short"></i></h3>
			  </div>
		  </div>
	  </div>
	<div class="cover-box">
	  	<h1>PET SHOP</h1>
		<p class="line">MAKE YOUR PET HAPPY</p>
		<p class="descript">Doloretemporclita lorem rebum kasd eirmod dolore was kasd,</p>
		<p class="descript">Kasd clita ea justo est kasd erat clita sea</p>
		
		<div class="video-box clearfix">
			<a href="">READ MORE</a>
			<div class="play-box">
				<i class="display-icon"></i>
				<p>Play Video</p>
			</div>
		</div>
	</div>
	<div class="second-screen screen-width">
		<div class="second-header-box">
			<h3>SERVICES</h3>
			<p class="bold-line">OUR EXCELLENT PET</p>
			<p class="bold-line">CARS SERVICES</p>
		</div>
		<div class="second-content-box">
			<div class="content-line-box">
				<div class="content-box clearfix">
					<div class="content-icon-box">
						<i class="flaticon-house"></i>
					</div>
					<div class="content-text-box">
						<p class="content-h3">PET BOARDING</p>
						<p class="content-desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
						<p class="read-more">READ MORE<i class="bi bi-arrow-right-short"></i></p>
					</div>
				</div>
				<div class="content-box">
					<div class="content-icon-box">
						<i class="flaticon-house"></i>
					</div>
					<div class="content-text-box">
						<p class="content-h3">PET BOARDING</p>
						<p class="content-desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
						<p class="read-more">READ MORE<i class="bi bi-arrow-right-short"></i></p>
					</div>
				</div>
			</div>
			
			<div class="content-line-box">
				<div class="content-box clearfix">
					<div class="content-icon-box">
						<i class="flaticon-house"></i>
					</div>
					<div class="content-text-box">
						<p class="content-h3">PET BOARDING</p>
						<p class="content-desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
						<p class="read-more">READ MORE<i class="bi bi-arrow-right-short"></i></p>
					</div>
				</div>
				<div class="content-box">
					<div class="content-icon-box">
						<i class="flaticon-house"></i>
					</div>
					<div class="content-text-box">
						<p class="content-h3">PET BOARDING</p>
						<p class="content-desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
						<p class="read-more">READ MORE<i class="bi bi-arrow-right-short"></i></p>
					</div>
				</div>
			</div>
			
			<div class="content-line-box">
				<div class="content-box clearfix">
					<div class="content-icon-box">
						<i class="flaticon-house"></i>
					</div>
					<div class="content-text-box">
						<p class="content-h3">PET BOARDING</p>
						<p class="content-desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
						<p class="read-more">READ MORE<i class="bi bi-arrow-right-short"></i></p>
					</div>
				</div>
				<div class="content-box">
					<div class="content-icon-box">
						<i class="flaticon-house"></i>
					</div>
					<div class="content-text-box">
						<p class="content-h3">PET BOARDING</p>
						<p class="content-desc">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et </p>
						<p class="read-more">READ MORE<i class="bi bi-arrow-right-short"></i></p>
					</div>
				</div>
			</div>
		</div>
	</div>
  </div>
</body>
</html>
